import VueRouter from "vue-router";
// VueRouter 路由器
import home from '../components/home.vue'
const routes = new VueRouter({
    // 区别 history路径不带#，比较美观
    // history模式，刷新后会把路径当成接口资源，但是hash模式不会
    mode: 'history',
    // mode:'hash',
    //routes 路由
    routes: [
        {
            path: '/',
            component: () => import('../components/app.vue'),
            //重定向 (展示重定向 里面的内容)
            redirect: { name: 'login' },
        },
        // 第一种引入方式
        {
            // path为/代表一进入页面就展示的也页面
            // path:'/',
            //路径跳转的路径，自己命名
            path: '/home',  //设置路径
            // 跳转到的组件
            component: home,
            // 命名路由
            name: 'home',
            // 路由元信息(写自定义变量)
            meta: {
                title: 'home',
                isAutr: true
            },

            // 路由嵌套  children
            children: [
                {
                    path: '/user',
                    component: () => import('../components/user.vue'),
                    name: 'user',
                    meta: {
                        title: 'user',
                        isAutr: true
                    }
                },
                {
                    path: '/shop',
                    component: () => import('../components/shop.vue'),
                    name: 'shop',
                    meta: {
                        title: 'shop',
                        isAutr: true
                    }
                },
                {
                    path: '/homepage',
                    component: () => import('../components/homepage.vue'),
                    name: 'homepage',
                    meta: {
                        title: 'homepage',
                        isAutr: true
                    }
                },
                {
                    path: '/PersonalCenter',
                    component: () => import('../components/PersonalCenter.vue'),
                    name: 'PersonalCenter',
                    meta: {
                        title: 'PersonalCenter',
                        isAutr: true
                    }
                },
            ],
        },
        // login页面
        {
            path: '/login',
            component: () => import('../components/login.vue'),
            name: 'login',
            meta: {
                title: 'login',
                isAutr: true
            }
        },
    ]
});

//前置守卫
routes.beforeEach((to, from, next) => {
    let UserName = localStorage.getItem("用户名")
    let PassWrod = localStorage.getItem('密码')
    if (to.path == '/login') {
        if (UserName && PassWrod) {
            next({ name: 'homepage' })
        } else {
            next()
        }

    } else {
        if (UserName && PassWrod) {
            next()
        } else {
            next({ name: 'login' })
        }
    }
})
routes.afterEach((to, from) => {
    // 改变头部的地址变为当前路由名
    document.title = to.meta.title
})

/* routes.beforeEach((to, from, next) => {
    next()
    if (localStorage.getItem('Data') ==  localStorage.getItem('inputData') && to.path == '/login') {
        next({ name: 'homepage' })
    }else if (localStorage.getItem('Data') !== localStorage.getItem('inputData')&& to.path != '/login') {
        next({ name: 'login' })
    }else{
        next()
    }
}) */

export default routes;